<template>
  <div id="app">
    <ConfigProvider :locale="locale">
      <!-- 根据用户登录状态选择布局 -->
      <component :is="currentLayout"></component>
    </ConfigProvider>
  </div>
</template>

<script setup lang="ts">
import 'dayjs/locale/zh-cn'
import { computed, onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import BasicLayout from '@/layouts/BasicLayout.vue'
import LoginLayout from '@/layouts/LoginLayout.vue'
import { ConfigProvider } from 'ant-design-vue'
import zhCN from 'ant-design-vue/es/locale/zh_CN'
import dayjs from 'dayjs'

dayjs.locale('zh-cn')
const locale = ref(zhCN)

const route = useRoute()

// 动态选择当前使用的布局组件
const currentLayout = computed(() => {
  // 如果是登录或注册页面，则使用 LoginLayout
  if (['/login', '/register'].includes(route.path)) {
    return LoginLayout
  }

  // 默认情况下，如果用户未登录但访问的是公开页面，则也使用 BasicLayout
  return BasicLayout
})

// 确保在初次加载时执行一次检查
onMounted(() => {
  currentLayout.value
})
</script>

<style scoped>
/* 组件样式 */
</style>
